<!--
 * @Date: 2022-03-24 21:29:09
 * @LastEditors: sailornpg
 * @LastEditTime: 2022-03-25 11:00:59
 * @FilePath: \vue3Components\src\components\Container\Navheader.vue
 * @Description: 头部组件
-->
<template>
  <div class="header">
    <span @click="toggle">
      <el-icon-expand style="width: 1em; height: 1em;" v-if="collapse"></el-icon-expand>
      <el-icon-fold style="width: 1em; height: 1em;" v-else></el-icon-fold>
    </span>
  </div>
</template>
 <script lang='ts' setup>
const props = defineProps<{
  collapse: boolean
}>()
const emits = defineEmits(['changToggle'])
const toggle = () => {
  console.log(123)
  emits('changToggle')
}
</script>
<style lang='less' scoped>
.header {
  height: 60px;
  display: flex;
  align-items: center;
  padding: 0 20px;
  font-size: 18px;
  border-bottom: 1px solid #ccc;
}
</style>